<template>
  <el-form :model="form" label-width="auto" style="max-width: 1300px" :inline="true">
    <el-form-item label="可视耳号">
      <el-input v-model="form.auricle" style="width: 100px;" placeholder="请输入"  />
    </el-form-item>
    <el-form-item label="电子耳号">
      <el-input v-model="form.corpuscleAuricle" style="width: 100px;" placeholder="请输入"/>
    </el-form-item>
    <el-form-item label="品种">
      <el-select v-model="form.sheepbreedId" placeholder="请选择" style="width: 100px;">
        <el-option v-for="item in SheepBeedData" :label="item.sheepbreedName" :value="item.sheepbreedId" />
      </el-select>
    </el-form-item>
    <el-form-item label="羊只性别">
      <el-select v-model="form.progenySex" placeholder="请选择" style="width: 100px;">
        <el-option label="公" :value=1 />
        <el-option label="母" :value=2 />
      </el-select>
    </el-form-item>
    <el-form-item label="出生日期">
      <el-date-picker
        v-model="value1"
        type="daterange"
        range-separator="To"
        start-placeholder="Start date"
        end-placeholder="End date"
        :size="size"
        style="width: 200px;"
      />
    </el-form-item>
    <el-form-item label="月龄">
      <el-input v-model="form.auricle" style="width: 65px;" placeholder="请输入"/>——
      <el-input v-model="form.auricle" style="width: 65px;" placeholder="请输入"/>
    </el-form-item>
    <el-form-item label="生长阶段">
      <el-select v-model="form.region" placeholder="请选择" style="width: 100px;">
        <el-option label="乳羊" value="1"  />
        <el-option label="保育" value="2" />
        <el-option label="后备公羊" value="3" />
        <el-option label="后背母羊" value="4" />
        <el-option label="后背羊" value="5" />
      </el-select>
    </el-form-item>
    <el-form-item label="位置">
      栋舍：<el-select v-model="form.region12" placeholder="请选择" style="width: 65px;">
        <el-option label="乳羊" value="1"  />
        <el-option label="保育" value="2" />
        <el-option label="后备公羊" value="3" />
        <el-option label="后背母羊" value="4" />
        <el-option label="后背羊" value="5" />
      </el-select>——
      栏位：<el-select v-model="form.region2" placeholder="请选择" style="width: 65px;">
        <el-option label="乳羊" value="1"  />
        <el-option label="保育" value="2" />
        <el-option label="后备公羊" value="3" />
        <el-option label="后背母羊" value="4" />
        <el-option label="后背羊" value="5" />
      </el-select>
      </el-form-item>
      <el-form-item label="羊只类型">
      <el-select v-model="form.region" placeholder="请选择" style="width: 100px;">
        <el-option label="种公" :value=1 />
        <el-option label="种母" :value=2 />
        <el-option label="后裔" :value=3 />
      </el-select>
    </el-form-item>
    <el-form-item label="基因等级">
      <el-select v-model="form.region" placeholder="请选择" style="width: 100px;">
        <el-option label="后备级" :value=1 />
        <el-option label="核心级" :value=2 />
        <el-option label="生产级" :value=3 />
        <el-option label="未定级" :value=4 />
      </el-select>
    </el-form-item>
    <el-form-item label="生产等级">
      <el-select v-model="form.region" placeholder="请选择" style="width: 100px;">
        <el-option label="后备群" :value=1 />
        <el-option label="生产群" :value=2 />
        <el-option label="核心群" :value=3 />
        <el-option label="未定级" :value=4 />
      </el-select>
    </el-form-item>
    <el-form-item label="销售等级">
      <el-select v-model="form.region" placeholder="请选择" style="width: 100px;">
        <el-option label="无" :value=1 />
        <el-option label="未定级" :value=2 />
      </el-select>
    </el-form-item>
    <el-form-item label="繁殖状态">
      <el-select v-model="form.region" placeholder="请选择" style="width: 100px;">
        <el-option label="后备空杯" :value=1 />
        <el-option label="返情空杯" :value=2 />
        <el-option label="未孕空杯" :value=3 />
        <el-option label="流产空杯" :value=4 />
        <el-option label="妊zhen空胎空怀" :value=5 />
        <el-option label="断奶空怀" :value=6 />
        <el-option label="renzhen" :value=7 />
        <el-option label="哺乳" :value=8 />
      </el-select>
    </el-form-item>
    <el-form-item label="繁殖状态天数">
      <el-input v-model="form.auricle" style="width: 65px;" placeholder="请输入"/>——
      <el-input v-model="form.auricle" style="width: 65px;" placeholder="请输入"/>
    </el-form-item>
    <el-form-item label="父亲耳号">
      <el-input v-model="form.auricle" style="width: 100px;" placeholder="请输入"/>
    </el-form-item>
    <el-form-item label="母亲耳号">
      <el-input v-model="form.auricle" style="width: 100px;" placeholder="请输入"/>
    </el-form-item>
    <el-form-item label="在线状态">
      <el-select v-model="form.region" placeholder="请选择" style="width: 100px;">
        <el-option label="在线" :value=1 />
        <el-option label="待入场" :value=2 />
        <el-option label="销售离场" :value=3 />
        <el-option label="死亡离场" :value=4 />
        <el-option label="淘汰已离场" :value=5 />
        <el-option label="调拨离场" :value=6 />
        <el-option label="死羔未入场" :value=7 />
      </el-select>
    </el-form-item>
    <el-button type="danger">查询</el-button>
    <el-button>重置</el-button>
    
    <el-upload
      class="upload-demo"
      action="http://localhost:5012/api/SheepFile/SheepFileImport"
      :headers="uploadHeaders"
      :on-success="handleImportSuccess"
      :on-error="handleImportError"
      :before-upload="beforeUpload"
      multiple
      :limit="1"
      accept=".xls,.xlsx" 
      style="margin-left: 830px;margin-top: -40px;"
    >
      <el-button  type="success">导入</el-button>
    </el-upload>
  </el-form>
  <el-table :data="tableData" style="width: 100%">
    <el-table-column prop="birthMessageId" label="序号" width="60" />
    <el-table-column prop="auricle" label="可视耳号" width="100"  >
      <template v-slot="{row}">
        <el-button type="primary"   @click="router.push('/SheepFiledetail?BreedingSheepArchiveId='+row.breedingSheepArchiveId)" link >{{row. auricle}}</el-button>
      </template>
      </el-table-column>
    <el-table-column prop="corpuscleAuricle" label="电子耳号" width="150" />
    <el-table-column prop="sheepbreedName" label="品种" width="100" />
    <el-table-column prop="sheepSex" label="性别" width="100" >
     <template v-slot="{row}">
      <el-tag v-if="row.sheepSex==1" >公</el-tag>
      <el-tag v-else type="danger">母</el-tag>
     </template>
      </el-table-column>
    <el-table-column prop="birthDate" label="出生日期" width="100" >
      <template v-slot="{row}">
    {{row.birthDate.substring(0,10)  }} 
     </template>
      </el-table-column>
    <el-table-column prop="date" label="日龄" width="100" >
      <template v-slot="{row}">
        {{(row.yearMD.substring(0,4)-row.birthDate.substring(0,4))*365+
        ((row.yearMD.substring(5,7)-row.birthDate.substring(5,7))*30)+
       (row.yearMD.substring(8,10)-row.birthDate.substring(8,10))}}
      </template>
      </el-table-column>
      <el-table-column prop="Month" label="月龄" width="100" >
      <template v-slot="{row}">
        {{(row.yearMD.substring(0,4)-row.birthDate.substring(0,4))*12+
        ((row.yearMD.substring(5,7)-row.birthDate.substring(5,7))) }}
      </template>
      </el-table-column>
    <el-table-column prop="sheepStatus" label="在场状态" width="100" >
      <template v-slot="{row}">
        <el-tag v-if="row.sheepStatus==0" type="danger">待入场</el-tag>
        <el-tag v-if="row.sheepStatus==1" type="primary">在线</el-tag>
      </template>
      
      </el-table-column>
    <el-table-column prop="date" label="阶段" width="100" />
    <el-table-column prop="sheepTypeId" label="类型" width="100" >
      <template v-slot="{row}">
        <el-tag v-if="row.sheepTypeId==1" type="warning" >种公</el-tag>
        <el-tag v-else-if="row.sheepTypeId==2" type="danger">种母</el-tag>
        <el-tag v-else>后裔</el-tag>
      </template>
      </el-table-column>
    <el-table-column prop="buildingName" label="栋舍" width="100" />
    <el-table-column prop="columnsName" label="栏位" width="100" />
    <el-table-column prop="name" label="繁殖状态" width="100" />
    <el-table-column prop="address" label="是否妊检" width="100" />
    <el-table-column prop="date" label="状态天数" width="100" />
    <el-table-column prop="name" label="生产等级" width="100" />
    <el-table-column prop="address" label="销售等级" width="100" />
    <el-table-column prop="geneLV" label="基因等级" width="100" >
      <template v-slot="{row}">
        <el-tag v-if="row.geneLV==1"  >后备级</el-tag>
        <el-tag v-else-if="row.geneLV==2" >核心级</el-tag>
        <el-tag v-else-if="row.geneLV==3" >生产级</el-tag>
        <el-tag v-else>未定级</el-tag>
      </template>
      </el-table-column>
    <el-table-column prop="birthWeight" label="出生重" width="100" />
    <el-table-column prop="address" label="断奶重" width="100" />
    <el-table-column prop="address" label="断奶日期" width="100" />
    <el-table-column prop="date" label="断奶日龄" width="100" />
    <el-table-column prop="dadEarNum" label="父亲号" width="120" >
      <template v-slot="{row}">
          <el-tag v-if="row.dadEarNum!=null">{{ row.dadEarNum }}</el-tag>
          <el-tag v-else>--</el-tag>
      </template>
      </el-table-column>
      <el-table-column prop="momEarNum" label="母亲号" width="120" >
      <template v-slot="{row}">
          <el-tag v-if="row.momEarNum!=null">{{ row.momEarNum }}</el-tag>
          <el-tag v-else>--</el-tag>
      </template>
      </el-table-column>
    <el-table-column prop="address" label="操作" width="180" >
      <template v-slot="{row}">
        <el-button type="primary"  link >修改</el-button>
        <el-button type="primary" link >删除</el-button>
      </template>
      </el-table-column>
  </el-table>
  
</template>

<script lang="ts" setup>
import router from '@/router';
import axios from 'axios';
import { ElMessage, type UploadProps } from 'element-plus';
import { reactive, ref,onMounted } from 'vue';
onMounted(()=>{
  SheepBeedSelest();
  GetList();
})
const form=reactive({

})
//列表显示
const tableData = ref([])
function GetList()
{
  axios.post("http://localhost:5012/api/SheepFile/SheepFileList",{
    BreedingSheepArchiveId:-1
  })
  .then(res=>{
    console.log("列表显示",res)
    tableData.value=res.data.data
  const Year=tableData.value[0].yearMD.substring(8,10)
  console.log(Year);
  })
}
//品种下拉框
const SheepBeedData=ref([])
function SheepBeedSelest()
{
  axios.post("http://localhost:5012/api/SheepFile/SheepBeedList",{})
  .then(res=>{
    SheepBeedData.value=res.data.data
  })
}
// 上传的文件对象引用
const upload = ref(null);

// 设置请求头，这里假设需要添加认证token
const uploadHeaders = {
  Authorization: 'Bearer'+ localStorage.getItem('token')
};

// 在文件上传之前进行校验
const beforeUpload = (file) => {
  const isExcel = file.type === 'application/vnd.ms-excel' || file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet';
  if (!isExcel) {
    ElMessage.error('请上传正确的Excel文件格式(.xls或.xlsx)');
    return false;
  }
  // 可添加其他校验逻辑，如文件大小限制等

  return true;
};

// 上传成功后的处理
const handleImportSuccess = (response, file, fileList) => {
  GetList();
  ElMessage.success('文件导入成功');
  console.log(response);
  // 根据后端返回的具体内容进行进一步处理，如更新数据列表等
};

// 上传失败后的处理
const handleImportError = (err, file, fileList) => {
  ElMessage.error('文件导入失败');
  console.error(err);
};
</script>
